<template>
  <a-modal
    v-model="show"
    :centered="true"
    :keyboard="false"
    :footer="null"
    :width="750"
    @cancel="onClose"
    :visiable="childVisible"
  >
    <a-form :form="firstForm">
      <a-row>
        <a-col :span="8" class="firstColAdd"> 发卡机构标识<span style="color: red">*</span></a-col>
        <a-col :span="9">
          <a-form-item style="display: none">
            <a-input type="hidden" name="binStartPos" v-decorator="['binStartPos']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="binDesc" v-decorator="['binDesc']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="cardNoTrack" v-decorator="['cardNoTrack']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="cardNoStartPos" v-decorator="['cardNoStartPos']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="binTrack" v-decorator="['binTrack']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="cardSign" v-decorator="['cardSign']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="maintainFlag" v-decorator="['maintainFlag']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="createTime" v-decorator="['createTime']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="updateTime" v-decorator="['updateTime']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="remark1" v-decorator="['remark1']"/>
          </a-form-item>
          <a-form-item style="display: none">
            <a-input type="hidden" name="remark2" v-decorator="['remark2']"/>
          </a-form-item>

          <a-form-item>
            <a-input name="issuerCode" v-decorator="['issuerCode' , {rules: [{required: true,max: 16, message: '请输入最多16位发卡机构号'}]} ]"/>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 发卡机构名称</a-col>
        <a-col :span="9">
          <a-form-item>
            <a-input name="issuerName"
                     v-decorator="['issuerName' , {required:true,max: 32 , message: '请输入发卡机构名称'}]"/>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 卡名称</a-col>
        <a-col :span="9">
          <a-form-item>
            <a-input name="cardName"
                     v-decorator="['cardName' , {rules: [{required:true,max: 32, message: '请输入最多32位卡名称'}]} ]"/>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 卡号长度</a-col>
        <a-col :span="9">
          <a-form-item>
            <a-input name="cardNoLen"
                     v-decorator="['cardNoLen' , {rules: [{pattern: /^\d{1,6}$/,max: 8, message: '请输入最多8位卡号长度数值'}]} ]"/>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 卡BIN</a-col>
        <a-col :span="9">
          <a-form-item>
            <a-input name="binNo"
                     v-decorator="['binNo' , {rules: [{required: true,pattern: /^\d{1,6}$/,max: 16, message: '请输入卡BIN'}]} ]"/>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 卡BIN长度</a-col>
        <a-col :span="9">
          <a-form-item>
            <a-input name="binLen"
                     v-decorator="['binLen' , {rules: [{required: true,pattern: /^\d{1,6}$/,max: 16, message: '请输入卡BIN长度数值'}]} ]"/>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 卡BIN状态</a-col>
        <a-col :span="9">
          <a-form-item>
            <a-select name="binStatus"
                      v-decorator="['binStatus' ,{rules: [{required: true, message: '请输入卡BIN状态'}]} ]">
              <a-select-option value="0">不可用</a-select-option>
              <a-select-option value="1">可用</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 银联品牌标识</a-col>
        <a-col :span="9">
          <a-form-item>
            <a-select name="cupLogoFlag"
                      v-decorator="['cupLogoFlag' ,{rules: [{required: true, message: '请输入银联品牌标识'}]} ]">
              <a-select-option value="Y">银联品牌</a-select-option>
              <a-select-option value="N">非银联品牌</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 卡类型<span style="color: red">*</span></a-col>
        <a-col :span="9">
          <a-form-item>
            <a-select name="cardType"
                      v-decorator="['cardType' ,{rules: [{required: true, message: '请输入卡类型'}]} ]">
              <a-select-option value="1">借记卡</a-select-option>
              <a-select-option value="2">贷记卡</a-select-option>
              <a-select-option value="3">准贷记卡</a-select-option>
              <a-select-option value="4">预付卡</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 卡属性<span style="color: red">*</span></a-col>
        <a-col :span="9">
          <a-form-item>
            <a-select name="cardAttr"
                      v-decorator="['cardAttr' ,{rules: [{required: true, message: '请输入卡属性'}]} ]">
              <a-select-option value="1">对公卡</a-select-option>
              <a-select-option value="2">对私卡</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row v-if="commentsShowFlag">
        <a-col :span="8" class="firstColAdd"> 前序批注<span style="color: red">*</span></a-col>
        <a-col :span="9">
          <a-form-item>
            <a-input name="prevComments" v-decorator="['prevComments']" disabled="true"/>
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>
      <a-row>
        <a-col :span="8" class="firstColAdd"> 批注<span style="color: red">*</span></a-col>
        <a-col :span="9">
          <a-form-item>
            <a-input name="nowComments" v-decorator="['nowComments']" />
          </a-form-item>
        </a-col>
        <a-col :span="6"/>
      </a-row>

      <a-row v-if="submitFlag">
        <a-col :span="8" class="firstColAdd"/>
        <a-col :span="9">
          <!--<a-button @click="submitForm" type="primary">通过</a-button>-->
          <a-popconfirm title="确定通过？" @confirm="submitForm(true)" okText="确定" cancelText="通过">
            <a-button style="margin-right: .8rem">通过</a-button>
          </a-popconfirm>
          <a-popconfirm title="确定退回？" @confirm="submitForm(false)" okText="确定" cancelText="退回">
            <a-button style="margin-right: .8rem">退回</a-button>
          </a-popconfirm>
        </a-col>
      </a-row>
    </a-form>
  </a-modal>
</template>
<script>
    import moment from "moment";
    moment.locale('zh-cn');

    export default {
        name: 'PBinInfoCheck',
        props: {
            childVisible: {
                require: true,
                default: false
            },
            bizData:{
                type: String
            },
            comments:{
                type: String
            },
            auditStatus:{
                type: String
            },
            passParamObj:{
                type: Object
            }
        },
        data() {
            return {
                firstForm: this.$form.createForm(this),
                submitFlag: false,
                bizDataObj:JSON.parse(this.bizData),
                optFlag:"",
                commentsShowFlag:false
            }
        },
        computed: {
            show: {
                get: function () {
                    return this.childVisible
                },
                set: function () {
                }
            }
        },
        methods: {
            setFormValues(record,optFlag) {

                this.firstForm.getFieldDecorator('issuerCode')
                this.firstForm.setFieldsValue({'issuerCode': record.issuerCode})
                this.firstForm.getFieldDecorator('binNo')
                this.firstForm.setFieldsValue({'binNo': record.binNo})
                this.firstForm.getFieldDecorator('binLen')
                this.firstForm.setFieldsValue({'binLen': record.binLen})
                this.firstForm.getFieldDecorator('issuerName')
                this.firstForm.setFieldsValue({'issuerName': record.issuerName})
                this.firstForm.getFieldDecorator('cardName')
                this.firstForm.setFieldsValue({'cardName': record.cardName})
                this.firstForm.getFieldDecorator('cardNoLen')
                this.firstForm.setFieldsValue({'cardNoLen': record.cardNoLen})
                this.firstForm.getFieldDecorator('binStartPos')
                this.firstForm.setFieldsValue({'binStartPos': record.binStartPos})
                this.firstForm.getFieldDecorator('binStatus')
                this.firstForm.setFieldsValue({'binStatus': record.binStatus})
                this.firstForm.getFieldDecorator('binDesc')
                this.firstForm.setFieldsValue({'binDesc': record.binDesc})
                this.firstForm.getFieldDecorator('cardNoTrack')
                this.firstForm.setFieldsValue({'cardNoTrack': record.cardNoTrack})
                this.firstForm.getFieldDecorator('cardNoStartPos')
                this.firstForm.setFieldsValue({'cardNoStartPos': record.cardNoStartPos})
                this.firstForm.getFieldDecorator('binTrack')
                this.firstForm.setFieldsValue({'binTrack': record.binTrack})
                this.firstForm.getFieldDecorator('cupLogoFlag')
                this.firstForm.setFieldsValue({'cupLogoFlag': record.cupLogoFlag})
                this.firstForm.getFieldDecorator('cardType')
                this.firstForm.setFieldsValue({'cardType': record.cardType})
                this.firstForm.getFieldDecorator('cardAttr')
                this.firstForm.setFieldsValue({'cardAttr': record.cardAttr})
                this.firstForm.getFieldDecorator('cardSign')
                this.firstForm.setFieldsValue({'cardSign': record.cardSign})
                this.firstForm.getFieldDecorator('maintainFlag')
                this.firstForm.setFieldsValue({'maintainFlag': record.maintainFlag})
                this.firstForm.getFieldDecorator('createTime')
                this.firstForm.setFieldsValue({'createTime': record.createTime})
                this.firstForm.getFieldDecorator('updateTime')
                this.firstForm.setFieldsValue({'updateTime': record.updateTime})
                this.firstForm.getFieldDecorator('remark1')
                this.firstForm.setFieldsValue({'remark1': record.remark1})
                this.firstForm.getFieldDecorator('remark2')
                this.firstForm.setFieldsValue({'remark2': record.remark2})

                if("view"==optFlag){
                    this.submitFlag = false;
                }else {
                    this.submitFlag = true;
                }
                this.optFlag = optFlag;
            },
            onClose() {
                this.firstForm.resetFields()
                this.$emit('closeChild')
            },
            submitForm(approved) {
                this.firstForm.validateFields((err, values) => {
                    if (!err) {
                        let url = "";
                        if("add" ==this.optFlag){
                            url = 'param/pbininfo/add';
                        }else if("check" ==this.optFlag){
                            url = 'param/pbininfo/check';
                        }else{
                            url = 'param/pbininfo/update';
                        }
                        var param={};
                        param.taskId = this.passParamObj.taskId;
                        param.comment = this.firstForm.getFieldValue('nowComments');
                        param.procInstId = this.passParamObj.procInstId;
                        param.approved = approved;
                        this.$put(url, {
                            ...param
                        }).then((r) => {
                            this.firstForm.resetFields()
                            this.$emit('successChild')
                        })
                    }
                })
            },
        },
        mounted(){
            this.bizDataObj = JSON.parse(this.bizData);
            if("41"==this.auditStatus){//修改审批中
                this.optFlag="check";
            }
            if(this.comments&&this.comments.length > 0){
                this.commentsShowFlag = true;
                this.firstForm.getFieldDecorator('prevComments')
                this.firstForm.setFieldsValue({'prevComments': this.comments})
            }
            this.setFormValues(this.bizDataObj,this.optFlag);
        }

    }
</script>
<style>

</style>
